<template>
    <el-dialog title="警告" v-model="visible" width="30%" @close="handleClose">
        <div class="dialog-content">
            <p>登录超时，请重新登录。</p>
        </div>
        <template #footer>
            <span class="dialog-footer">
                <el-button type="primary" @click="handleConfirm"
                    >确定</el-button
                >
            </span>
        </template>
    </el-dialog>
</template>

<script>
import { app } from "@/main";
export default {
    data() {
        return {
            visible: false,
        };
    },
    methods: {
        show() {
            this.visible = true;
        },
        handleClose() {
            this.visible = false;
        },
        handleConfirm() {
            this.visible = false;
            // 重定向到登录页面
            this.$router.push("/login");
        },
    },
    mounted() {
        // 挂载到app实例上
        app.$showSessionExpiredDialog = this.show;
    },
};
</script>

<style scoped>
.dialog-content {
    text-align: center;
}
</style>
